<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>angular table</title>
    <link href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
    <link href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap-theme.min.css" rel="stylesheet">
    <link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <link rel="stylesheet" href="../src/ourpalm-table.css">
</head>
<body>

<div class="container" ng-controller="DemoController as vm">
    <h1>hello angular ourpalm-table！</h1>
    <h2>内存加载数据！</h2>

    <table ourpalm-table="vm.table" class="table table-bordered table-striped table-hover text-center">
        <tr ng-repeat="$row in $rows">
            <td table-column header="全选" field="select" checkbox="true" style="width:30px;"></td>
            <td table-column header="序号" field="number" rownumbers="true" style="width:40px;"></td>
            <td table-column header="姓名" field="name">{{$row.name}}</td>
            <td table-column header="年龄" field="age">{{$row.age}}</td>
            <td table-column header="邮箱" field="email">{{$row.email}}</td>
        </tr>
    </table>

</div>


<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="http://cdn.bootcss.com/angular.js/1.5.6/angular.min.js"></script>
<script src="../ourpalm-table.js"></script>
<script>

    angular
            .module('app', ['ourpalm-table'])
            .controller('DemoController', function ($timeout, OurpalmTable) {
                var vm = this;

                var start = 1, end = 86;
                //构造内存假数据
                var rows = [];
                for (; start < end; start++) {
                    rows.push({
                        name: `zhangsan${start}`,
                        age: start,
                        email: `zhangsan${start}@163.com`
                    });
                }


                vm.table = new OurpalmTable({
                    serverLoad: false,
                    data: rows
                });
            });

    angular.bootstrap(document, ['app']);

</script>

</body>
</html>
